{include file="public/layout" /}

<body class="bodystyle" style="cursor: default; -moz-user-select: inherit;min-width:auto;">
<div id="toolTipLayer" style="position: absolute; z-index: 9999; display: none; visibility: visible; left: 95px; top: 573px;"></div>
<div id="append_parent"></div>
<div id="ajaxwaitid"></div>
{include file="system/left" /}
<div class="page arctype pb15 min-hg-c-10" style="min-width:auto;margin-left:100px;">
    <div class="ncap-form-default flexigrid htitx pt0">
        <div class="fixed-bar">
            <div class="item-title">
                <a class="back_xin" href="javascript:history.back();" title="返回"><i class="iconfont e-fanhui"></i></a>
                <div class="subject"> <h3>新增运费模板</h3> <h5></h5> </div>
            </div>
        </div>

        <form class="form-horizontal" id="post_form">
            <dl class="row">
                <dt class="tit"> <label for="template_name"><em>*</em>模板名称</label> </dt>
                <dd class="opt"> <input id="template_name" name="template_name" class="input-txt" type="text"/> </dd>
            </dl>

            <dl class="row">
                <dt class="tit"> <label>快递公司</label> </dt>
                <dd class="opt">
                    <select name="express_id" id="select_express" style="width: 300px;" onchange="selectExpress(this);">
                        <option value="0">请选择</option>
                        {volist name="$express" id="vo"}
                        <option value="{$vo.express_id}">{$vo.express_name}</option>
                        {/volist}
                    </select>
                    <div class="express-tag">
                        {volist name="$express" id="vo"}
                        {if condition='$i <= 5'}
                        <span class="span_all span_{$vo.express_id}" data-id="{$vo.express_id}" data-i="{$i}" onclick="spanSelectExpress(this);">{$vo.express_name}</span>
                        {/if}
                        {/volist}
                    </div>
                </dd>
            </dl>

            <dl class="row">
                <dt class="tit"> <label for="site_url">运费设置</label> </dt>
                <dd class="opt">
                    <div class="order-express-bg">
                        <div class="hDiv">
                            <div class="hDivBox">
                                <table cellpadding="0" cellspacing="0" style="width: 100%;background: #fff;">
                                    <thead>
                                        <tr>
                                            <th axis="col2" class=""> <div class="text-l10">配送范围</div> </th>
                                            <th axis="col2" class="w220"> <div class="tc">运费（元）</div> </th>
                                        </tr>
                                    </thead>
                                </table>
                            </div>
                        </div>
                        <div id="flexigrid" class="bDiv" style="height: auto;">
                            <table class="flex-table autoht" cellpadding="0" cellspacing="0" border="0" style="width: 100%">
                                <tbody id="templateTbody">
                                    <tr class="templateTr" id="templateTr_0">
                                        <td style="width: 100%"> <div class=" text-l10">全国统一运费</div> </td>
                                        <td class="operation">
                                            <div class="w220 tc">
                                                <input type="text" name="template_data[freight_fee][]" class="tc freight_fee" onpaste="this.value=this.value.replace(/[^\d.]/g, '');" onkeyup="this.value=this.value.replace(/[^\d.]/g, '');">
                                                <input type="hidden" name="template_data[freight_ids][]" value="0" class="freight_ids">
                                                <input type="hidden" name="template_data[freight_names][]" value="全国统一运费">
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                        <div class="add-con tc">
                            <a class="ment-btn ment-btn-text" href="JavaScript:void(0);" onclick="addDeliveryArea(this);"><span>+添加配送区域</span></a>
                        </div>
                    </div>
                    <input type="hidden" id="selected_city_ids">
                </dd>
            </dl>

            <dl class="row">
                <dt class="tit"> <label>特殊区域设置</label> </dt>
                <dd class="opt">
                    <label> <input type="radio" name="special_set" value="1" onclick="specialSet(1);" checked="checked">不配送区域</label>
                    &nbsp;&nbsp;&nbsp;
                    <label> <input type="radio" name="special_set" value="2" onclick="specialSet(2);">只配送区域</label>
                    <!-- 未添加数据时 -->
                    <div class="order-express-bg specialData" id="specialData_0">
                        <div class="area">
                            <div class="area-content"></div>
                            <div class="add-con tc">
                                <a class="ment-btn ment-btn-text" href="JavaScript:void(0);">
                                    <span id="specialData" data-id="1" onclick="setSpecialArea(this);">+添加不配送区域</span>
                                </a>
                            </div>
                        </div>
                    </div>
                    <!-- 已添加数据后 -->
                    <div class="order-express-bg specialData" id="specialData_1" style="display: none;">
                        <div class="area">
                            <div class="area-content"></div>
                            <div class="area-btn">
                                <a href="JavaScript:void(0);" data-id="1" onclick="setSpecialArea(this);">编辑</a>
                                &nbsp;&nbsp;&nbsp;
                                <a href="JavaScript:void(0);" data-id="1" onclick="delSpecialArea(this);">删除</a>
                            </div>
                        </div>
                    </div>
                    <!-- 已添加数据后 -->
                    <div class="order-express-bg specialData" id="specialData_2" style="display: none;">
                        <div class="area">
                            <div class="area-content"></div>
                            <div class="area-btn">
                                <a href="JavaScript:void(0);" data-id="2" onclick="setSpecialArea(this);">编辑</a>
                                &nbsp;&nbsp;&nbsp;
                                <a href="JavaScript:void(0);" data-id="2" onclick="delSpecialArea(this);">删除</a>
                            </div>
                        </div>
                    </div>
                </dd>
            </dl>

            <dl class="row">
                <dt class="tit"> <label>设为默认</label> </dt>
                <dd class="opt">
                    <label> <input type="radio" name="default" value="1">是 </label>
                    &nbsp;&nbsp;&nbsp;
                    <label> <input type="radio" name="default" value="2" checked="checked">否 </label>
                </dd>
            </dl>

            <dl class="row">
                <dt class="tit"> <label>是否启用</label> </dt>
                <dd class="opt">
                    <label> <input type="radio" name="status" value="1" checked="checked">是 </label>
                    &nbsp;&nbsp;&nbsp;
                    <label> <input type="radio" name="status" value="2">否 </label>
                </dd>
            </dl>

            <div class="ncap-form-default">
                <div class="bot2 e-l-110">
                    <a href="JavaScript:void(0);" onclick="submitForm();" class="ncap-btn-big ncap-btn-green">保存</a>
                    <a class="ncap-btn-big ncap-btn-no" href="javascript:history.back();" title="返回">返回</a>
                </div>
            </div> 
        </form>
    </div>
</div>

<script type="text/javascript">
    function addDeliveryArea(obj) {
        var result = '';
        $(".freight_ids").each(function() {
            var value = parseInt($(this).val()) === 0 ? $(this).val() + ',' : $(this).val();
            result = result + value;
        });
        $('#selected_city_ids').val(result);

        var url = "{:url('ShopFreight/area_list')}";
        //iframe窗
        layer.open({
            type: 2,
            move: false,
            closeBtn: false,
            title: '添加配送范围',
            shade: layer_shade,
            area: ['1100px', '90%'],
            btn: ['确定', '关闭'],
            content: url,
            yes: function(index, layero) {
                var body = layer.getChildFrame('body', index);

                // 名称显示处理
                var provinceName = [];
                var pageProvinceName = body.find('.page_province_name');
                pageProvinceName.each(function() {
                    if ($(this).val()) provinceName.push($(this).val());
                });
                var page_city_names = '';
                if (parseInt(provinceName.length) > 0) page_city_names = provinceName.join('、');

                // ID处理
                var page_city_ids = body.find('#page_city_ids').val();
                $('#selected_city_ids').val(page_city_ids);

                // 加载HTML
                layer.close(index);
                var serialNum = $('.templateTr').length;
                var templateHtml = [];
                templateHtml += [
                    '<tr class="templateTr" id="templateTr_'+serialNum+'">'+
                        '<td style="width: 100%">'+
                            '<div class=" text-l10">'+
                                '<span id="freight_names_'+serialNum+'">'+page_city_names+'</span> <br/>'+
                                '<span>'+
                                    '<a href="JavaScript:void(0);" onclick="editDeliveryArea(this, '+serialNum+');">编辑</a> |'+
                                    '<a href="JavaScript:void(0);" onclick="delDeliveryArea('+serialNum+');">删除</a>'+
                                '</span>'+
                            '</div>'+
                        '</td>'+
                        '<td class="operation">'+
                            '<div class="w220 tc">'+
                                '<input type="text" name="template_data[freight_fee][]" class="tc freight_fee"  onpaste="this.value=this.value.replace(/[^\\d.]/g, \'\');" onkeyup="this.value=this.value.replace(/[^\\d.]/g, \'\');">'+
                                '<input type="hidden" name="template_data[freight_ids][]" id="freight_ids_'+serialNum+'" value="'+page_city_ids+'" class="freight_ids">'+
                                '<input type="hidden" name="template_data[freight_names][]" id="input_freight_names_'+serialNum+'" value="'+page_city_names+'">'+
                            '</div>'+
                        '</td>'+
                    '</tr>'
                ];
                $('#templateTbody').append(templateHtml);
            }
        });
    }

    function editDeliveryArea(obj, serial_id) {
        var result = '';
        $(".freight_ids").each(function(){
            if (this.id != 'freight_ids_' + serial_id) result = result + $(this).val();
        });
        $('#selected_city_ids').val(result);

        var url = "{:url('ShopFreight/area_list')}";
        if (url.indexOf('?') > -1) {
            url += '&';
        } else {
            url += '?';
        }
        url += 'serial_id=' + serial_id;
        //iframe窗
        layer.open({
            type: 2,
            move: false,
            closeBtn: false,
            title: '编辑配送范围',
            shade: layer_shade,
            area: ['80%', '90%'],
            btn: ['确定', '关闭'],
            content: url,
            yes: function(index, layero) {
                var body = layer.getChildFrame('body', index);

                // 名称显示处理
                var provinceName = [];
                var pageProvinceName = body.find('.page_province_name');
                pageProvinceName.each(function() {
                    if ($(this).val()) provinceName.push($(this).val());
                });
                var page_city_names = '';
                if (parseInt(provinceName.length) > 0) page_city_names = provinceName.join('、');
                $('#freight_names_' + serial_id).html(page_city_names);
                $('#input_freight_names_' + serial_id).val(page_city_names);

                // ID处理
                var page_city_ids = body.find('#page_city_ids').val();
                $('#freight_ids_' + serial_id).val(page_city_ids);
                layer.close(index);
            }
        });
    }

    function delDeliveryArea(serial_id) {
        $('#templateTr_' + serial_id).remove();
    }
</script>

<script type="text/javascript">
    function specialSet(value) {
        if (1 === parseInt(value)) {
            $('#specialData').html('+添加不配送区域').attr('data-id', 1);
        } else if (2 === parseInt(value)) {
            $('#specialData').html('+添加只配送区域').attr('data-id', 2);
        }
        var areaContent = $('#specialData_' + value + ' .area-content').html();
        if (areaContent) {
            $('.specialData').hide();
            $('#specialData_' + value).show();
        } else {
            $('.specialData').hide();
            $('#specialData_0').show();
        }
    }
    
    function delSpecialArea(obj) {
        var special_id = $(obj).attr('data-id');
        $('#specialData_' + special_id + ' .area-content').empty();
        specialSet(special_id);
    }

    function setSpecialArea(obj) {
        var special_id = $(obj).attr('data-id');
        var url = "{:url('ShopFreight/special_area_list')}";
        if (url.indexOf('?') > -1) {
            url += '&';
        } else {
            url += '?';
        }
        url += 'special_id=' + special_id;

        if (1 === parseInt(special_id)) {
            var title = '设置不配送区域';
        } else if (2 === parseInt(special_id)) {
            var title = '设置只配送区域';
        }
        //iframe窗
        layer.open({
            type: 2,
            move: false,
            closeBtn: false,
            title: title,
            shade: layer_shade,
            area: ['80%', '90%'],
            btn: ['确定', '关闭'],
            content: url,
            yes: function(index, layero) {
                var body = layer.getChildFrame('body', index);
                var page_city_ids = body.find('#page_city_ids').val();
                // 名称显示处理
                var provinceName = [];
                var pageProvinceName = body.find('.page_province_name');
                pageProvinceName.each(function() {
                    if ($(this).val()) provinceName.push($(this).val());
                });
                var page_city_names = '';
                if (parseInt(provinceName.length) > 0) page_city_names = provinceName.join('、');

                $('.specialData').hide();
                $('#specialData_' + special_id).show();
                layer.close(index);
                var specialHtml = [];
                specialHtml += [
                    '<span>'+page_city_names+'</span> <br/>'+
                    '<input type="hidden" name="special_data_'+special_id+'[]" id="special_ids_'+special_id+'" value="'+page_city_ids+'">'+
                    '<input type="hidden" name="special_data_'+special_id+'[]" id="special_names_'+special_id+'" value="'+page_city_names+'">'
                ];
                $('#specialData_' + special_id + ' .area-content').empty().html(specialHtml);
            }
        });
    }
</script>

<script type="text/javascript">
    // 下拉框选择
    function selectExpress(obj) {
        // 选中的对象
        var selectObj = $(obj).find("option:selected");
        // span选中效果
        $('.span_all').removeClass('select-express');
        $('.span_' + $(selectObj).attr('value')).addClass('select-express');
    }

    // span选择
    function spanSelectExpress(obj) {
        // 赋值隐藏域
        $('#express_id').val($(obj).data('id'));
        // 下拉框选中效果
        var obj_i = $(obj).data('i');
        obj_i++;
        $("#select_express option:nth-child("+obj_i+")").prop("selected", 'selected');
        // span选中效果
        $('.span_all').removeClass('select-express');
        $('.span_' + $(obj).data('id')).addClass('select-express');
    }
</script>

<script type="text/javascript">
    function submitForm() {
        // 检测模板名称是否填写
        var templateName = $('#template_name').val();
        if (undefined == templateName || '' == templateName) {
            $('#template_name').focus();
            showErrorMsg('请填写模板名称');
            return false;
        }

        // 检测运费是否都已填写
        // var isMsg = 0;
        // $(".freight_fee").each(function() {
        //     if (!$(this).val() || 0 == $(this).val()) {
        //         isMsg = 1;
        //         $(this).focus();
        //         showErrorMsg('请填写运费');
        //         return false;
        //     }
        // });
        // if (1 == isMsg) return false;

        // layer_loading('正在处理');
        $.ajax({
            type: 'post',
            url : "{:url('ShopFreight/add', ['_ajax'=>1])}",
            data: $('#post_form').serialize(),
            dataType: 'json',
            success : function(res) {
                layer.closeAll();
                if (1 === parseInt(res.code)) {
                    layer.msg(res.msg, {icon: 1, time: 1000}, function() {
                        window.location.href = res.url;
                    });
                } else {
                    // 提示内容
                    showErrorMsg(res.msg);
                }
            },
            error: function(e) {
                showErrorAlert(e.responseText);
            }
        });
    }
</script>

{include file="public/footer" /}
<script type="text/javascript">
    try{
        var mt20_1649209614 = sessionStorage.getItem("mt20_1649209614");
        if (mt20_1649209614 == 1){
            $("#geduan_div").removeClass("h15");
        } else {
            $("#geduan_div").addClass("h15");
        }
    }catch(e){}
</script>